<template>
   <el-container>
    <el-aside :width="isCollapseFlag ? '61px' : '230px'" :class="isCollapseFlag? '':'pd-5'" class="bg-58 boxS-i-4 mgr-20">
      <Aside :menuList="HomeList"  :isCollapse="isCollapseFlag" @getCollapseFlag="getCollapseFlag" :AsideType="AsideType"/>
    </el-aside>
    <el-main>
        <div class="flex mgb-20">
          <drop-down2  :text="text" />
          <el-button type="primary" class="color-0 bg-theme fonW-7 font-14 border-n font-f-ib" style="padding:11px">{{$t('collection.average_price')}}<i style="margin-left:100px">169.2286</i> </el-button>
          <el-button type="primary" class="color-0 bg-theme fonW-7 font-14 border-n font-f-ib" style="padding:11px">{{$t('collection.average_amount')}}<i style="margin-left:100px">169.2286</i> </el-button>
        </div>
        <div>
          <home-table :homeData="homeData"/>
        </div>
    </el-main>
  </el-container>
</template>
<script>
import DropDown2 from '../../components/component/Dropdown2'
import HomeTable from '../../components/component/HomeTable'
import Aside from '../../components/component/Aside'
import {HomeList, homeData} from '../../mock/data'
export default {
  props: {
    AsideType: Number
  },
  components: {
    DropDown2,
    HomeTable,
    Aside
  },
  data () {
    return {
      HomeList: HomeList,
      homeData: homeData,
      text: '14天',
      isCollapseFlag: false
    }
  },
  mounted () {
    // console.log(this.menuList, this.isCollapse)
    console.log(this.AsideType, '111111111111111111')
  },
  methods: {
    getCollapseFlag: function (val) {
      this.isCollapseFlag = val
    }
  }
}
</script>
<style lang="less"  scoped>
.el-button--primary:focus, .el-button--primary:hover{
  background: #7de9ff;
}
</style>
